<!--
 * @Author: Vi卡农
 * @Date: 2020-04-21 17:45:06
 * @LastEditTime: 2020-05-12 17:09:36
 * @Description: -合同page-
 * @FilePath: \cshf_admin\src\views\modules\contract\contractPages.vue
 -->
<template>
  <div class="contractPages">
    <el-row>
      <el-col :span="18">合同管理 - 合同详情</el-col>
      <el-col :span="5" style="text-align:right">
        <el-button type="text" icon="el-icon-edit" @click="UpdateHandle">修改</el-button>
      </el-col>
    </el-row>
    <el-card class="box-card" shadow="hover">
      <div slot="header" class="clearfix">
        <span class="font_wei600" style="font-size:18px">合同编号：{{"HT - "+contractId}}</span>
      </div>
      <el-tabs v-model="activeName" class="customTabs">
        <el-tab-pane name="first">
          <div slot="label">
            <img src="~@/assets/img/基本信息.png" alt />
            <div class="text_center">基本信息</div>
          </div>
          <contractLease :contractId="contractId" ref="contractLease"></contractLease>
        </el-tab-pane>
        <el-tab-pane name="syslogdetailed">
          <div slot="label">
            <img src="~@/assets/img/任务中心.png" alt />
            <div class="text_center">操作日志</div>
          </div>
          <syslogdetailed :contractId="contractId"></syslogdetailed>
        </el-tab-pane>

        <el-tab-pane name="tixingjilu">
          <div slot="label">
            <img src="~@/assets/img/提醒记录.png" alt />
            <div class="text_center">提醒记录</div>
          </div>
        </el-tab-pane>
      </el-tabs>
    </el-card>

    <add-or-update v-if="UpdateVisible" ref="addOrUpdate"></add-or-update>
  </div>
</template>
<script>
import contractLease from "./page/contractLease";
import syslogdetailed from "./page/syslogdetailed";
import AddOrUpdate from "./contractinfo-add-or-update";
export default {
  name: "",
  data() {
    return {
      contractId: this.$route.query.ID,
      activeName: "first",
      UpdateVisible: false
    };
  },
  components: {
    contractLease,
    syslogdetailed,
    AddOrUpdate
  },
  created() {},
  methods: {
    UpdateHandle() {
      this.UpdateVisible = true;
      this.$nextTick(() => {
        this.$refs.addOrUpdate.dataForm.id = this.$route.query.ID;
        this.$refs.addOrUpdate.init();
      });
    },
    CloseDialogFun() {
      this.UpdateVisible = false;
      this.$refs.contractLease.getIntention();
    }
  },
  watch: {
    $route(to, from) {
      if (to.name == "contractPages") {
        this.contractId = this.$route.query.ID;
      }
    }
  }
};
</script>
<style scoped>
</style>